<template>
  <div class="fix-btn">
    <div v-if="cStepType == 'C'">
      <button v-if="cReadSw == 'Y'" class="blue-btn" @click="doOperate('DoRead')">知阅</button>
    </div>
    <div v-else>
      <button v-if="cApprovalSw == 'Y'" class="blue-btn" @click="doOperate('Approval')">同意</button>
      <button v-if="cAddSw == 'Y'" class="white-btn" @click="doOperate('AddStep')">
        <span>+</span> 加签</button>
      <span v-if="cPushbackAllSw == 'Y'" class="reject-main">
        <button class="yellow-btn" @click="popGroup">驳回</button>
        <transition name="slide-fade">
          <span v-if="showGroup" class="reject-group">
            <button class="yellow-btn" @click="doOperate('PushAllback')">重走</button>
            <button class="yellow-btn" @click="doOperate('Pushback')">不重走</button>
          </span>
        </transition>
      </span>
    </div>
  </div>
</template>

<script>
import {
  getCompensateApprove,
  getFormalApprove,
  getWastageApprove,
  getRecruitmentApproveDrft,
  approveMobilize,
  perresultApproveApel,
  getRecruitmentNeedsApproveRec } from "../../../api/api";
import { json2Form } from "../../../util/http";
export default {
  
  props: {
    cApprovalSw: String,
    cDenySw: String,
    cPushbackAllSw: String,
    cAddSw: String,
    cReadSw: String,
    cStepType:String,
    cTransactionNbr: String,
    cWfType: String,
    cComments: String,
    // actionType: actionType,
    cLink: String,
    //需要填充业务数据
    getBizParams: {
      type: Function,
      default: () => {
        return {}
      }
    },
    validSubmit: {
      type: Function,
      default: () => {
        return true;
      }
    },
    //需要作业务校验的，是不是只有在同意时校验？？？？FIXME
    validAgree: {
      type: Function,
      default: () => {return true;}
    },
    approveBizType: String//根据业务类型使用不同的接口
  },
  data() {
    return {
      showGroup: false
    }
  },
  created() {
    window.onclick = this.hideGroup
  },
  methods: {
    popGroup() {
      this.showGroup = !this.showGroup
      window.event.cancelBubble = true
    },
    doOperate(actionType) {
      if (actionType == 'PushAllback' || actionType == 'Pushback') {
        this.showGroup = !this.showGroup
      }
      window.event.cancelBubble = true
      let baseParams = {
            cTransactionNbr: this.cTransactionNbr,
            cWfType: this.cWfType,
            cComments: this.cComments,
            cLink: this.cLink,
            actionType: actionType,
            approveBizType: this.approveBizType
      }
      if(actionType != 'AddStep' && actionType != 'PushAllback'
        && actionType != 'Pushback' && !this.validSubmit()) {
        return;
      }
      let bizParams = this.getBizParams()

      let params = {
        ...baseParams,
        ...bizParams
      }
      if (actionType == "AddStep") {
        //加签需要跳转至加签页面，并携带参数
        this.$router.push({
          name: "Visa",
          params: params
        });
      } else if (actionType == "PushAllback" || actionType == "Pushback") {
        this.$router.push({
          name: "pushback",
          params: params
        });
      } else if (actionType == "DoRead") {
          if(!this.validAgree()){
            return;
          }
          let approveFun = getCompensateApprove;
          switch(this.approveBizType){
            case "formal":
              approveFun = getFormalApprove
              break
            case "mobilization":
              approveFun = approveMobilize
              break
            case "wastage":
              approveFun = getWastageApprove
              break
            case "recruitment":
              approveFun = getRecruitmentApproveDrft
              break
            case "rec":
              approveFun = getRecruitmentNeedsApproveRec
              break
            case "perresult":
              approveFun = perresultApproveApel
              break
            default:
              approveFun = getCompensateApprove
              break
          }
          console.error("approve type:" + this.approveBizType)
          console.error(approveFun)
          console.error(params)
          approveFun(json2Form(params))
            .then(res => {
              if (res && res.retCode === "000000") {
                  this.$router.push("/todoList/todo");
              } else {
                this.$vux.alert.show({
                  title: "提示",
                  content: res.retMsg
                });
              }
            })
            .catch(res => {
              this.$vux.alert.show({
                title: "警告",
                content: "网络异常，请稍后重试"
              });
            });

      } else {
        if(!this.validAgree()){
          return;
        }
        this.$vux.confirm.show({
          title: "提示",
          content: "您确认要同意？",
          onConfirm: () => {
            let approveFun = getCompensateApprove;
            switch(this.approveBizType){
              case "formal":
                approveFun = getFormalApprove
                break
              case "mobilization":
                approveFun = approveMobilize
                break
              case "wastage":
                approveFun = getWastageApprove
                break
              case "recruitment":
                approveFun = getRecruitmentApproveDrft
                break
              case "rec":
                approveFun = getRecruitmentNeedsApproveRec
                break
              case "perresult":
                approveFun = perresultApproveApel
                break
              default:
                approveFun = getCompensateApprove
                break
            }
            console.error("approve type:" + this.approveBizType)
            console.error(approveFun)
            console.error(params)
            approveFun(json2Form(params))
              .then(res => {
                if (res && res.retCode === "000000") {
                    this.$router.push("/todoList/todo");
                } else {
                  this.$vux.alert.show({
                    title: "提示",
                    content: res.retMsg
                  });
                }
              })
              .catch(res => {
                this.$vux.alert.show({
                  title: "警告",
                  content: "网络异常，请稍后重试"
                });
              });
          }
        });
      }
    },
    hideGroup() {
      this.showGroup = false
    }
  }
}
</script>

<style type="text/scss" lang="scss">
.reject-main {
  position: relative;
  .reject-group {
    position: absolute;
    top: -80px;
    left: 0px;
    button {
      margin-bottom: 1px;
    }
  }
}
.slide-fade-enter-active {
  transition: all 0.1s ease;
}
.slide-fade-leave-active {
  transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
}
.slide-fade-enter, .slide-fade-leave-to
/* .slide-fade-leave-active for below version 2.1.8 */ {
  transform: translateY(10px);
  opacity: 0;
}
</style>

